import React from 'react'
import { connect } from 'dva'

import AddressItem from '../components/AddressItem'
import Title from '../components/Title'

class Index extends React.Component {
    toEdit = () => {
        const { history } = this.props
        history.push('/addressEdit')
    }

    componentDidMount() {
        const { dispatch } = this.props
        dispatch({
            type: 'user/findAddress'
        })
    }

    renderAddressList = () => {
        const { user } = this.props
        const { list } = user.addressList

        return list.map(item => (
            <AddressItem
                data={item}
                key={item._id}
            />
        ))
    }

    render() {


        return (
            <div className='addressList'>
                <Title title="我的地址" />
                {this.renderAddressList()}
                <div 
                    className='btn addAddressBtn'
                    onClick={this.toEdit}
                >
                    新增地址
                </div>
            </div>
        )
    }
}

const mapState = state => ({
    user: state.user
})
export default connect(mapState)(Index)
